<template>
{{#if page.psSysPFPlugin}}
    {{> @macro/plugins/view/view-use.hbs appPlugin=page.psSysPFPlugin}}
{{else}}
    {{#if page.psViewLayoutPanel.useDefaultLayout}}
    <AppSDViewLayout :class="classNames" :openType="openType">
        <template v-if="!noViewCaption && model.showCaption" #viewHeaderContentLeft>
            <div class="view-header__caption">
                {{> @macro/view/view-caption.hbs}}
                {{> @macro/view/view-datainfo-bar.hbs}}
            </div>
        </template>
        <template #viewHeaderContentRight>
            <div class="view-header__toolbar">
                {{#each page.ctrls as | ctrl |}}
                    {{#eq ctrl.controlType 'TOOLBAR'}}
                {{> @macro/widgets/toolbar/toolbar.hbs page=page ctrl=ctrl}}
                    {{/eq}}
                {{/each}}
                <template v-if="store.actionGroup">
                    <template v-for="(item, index) in store.actionGroup.details" :key="index">
                        <AppButton
                            v-show="item.visible"
                            :disabled="item.disabled"
                            :loading="store.loadingHelper.isLoading"
                            @click="(event: MouseEvent) => handleActionClick(event, item)">
                            <AppIconText
                                :iconClass="item.showIcon && item.iconClass"
                                :imgPath="item.showIcon && item.imgPath"
                                :text="item.showCaption && item.caption"
                            />
                        </AppButton>
                    </template>
                </template>
                <template v-for="(item, index) in store.dynamicToolbar" :key="index">
                        <AppButton
                            :loading="store.loadingHelper.isLoading"
                            @click="handleDynamicToolbarClick(item)">
                            <AppIconText :text="item.sequenceFlowName" />
                        </AppButton>
                </template>
            </div>
        </template>
        <template #default>
            <component
                v-if="store.activeForm.codeName"
                :name="store.activeForm.name"
                :is="componentList[`${store.activeForm.name}Form`]"
                :actions="store.activeForm.actions"
                :context="store.context"
                :isEditable="store.isEditable"
                :viewParams="store.viewParams"
                :closeView="store.closeView"
                :pLoadingHelper="store.loadingHelper"
                :openView="store.openView"
                :newView="store.newView"
                @ctrl-init="(name:string, ability:any) => { handleCtrlInit(controller, name, ability) }"
                @ctrl-action="(name:string, action:any, data:any) => { handleCtrlAction(controller, name, action, data) }"
                @ctrl-destroy="(name:string, data:any) => { handleCtrlDestroy(controller, name, data) }" />
        </template>
    </AppSDViewLayout>
    {{else}}
    <div :class="classNames">
        {{#if page.psViewLayoutPanel.rootPSPanelItems}}
        {{#each page.psViewLayoutPanel.rootPSPanelItems as | panelItem |}}
        {{> @macro/widgets/panel-detail/include-panel.hbs type=panelItem.itemType item=panelItem isMultiData=false panel=page.psViewLayoutPanel page=page}}
        {{/each}}
        {{/if}}
    </div>
    {{/if}}
{{/if}}
</template>
<script lang="ts" setup>
// 基于template/src/views/\{{appModules}}/\{{pages@DEWFDYNAEDITVIEW}}/\{{spinalCase page.codeName}}.vue.hbs生成
{{#if page.psViewLayoutPanel.useDefaultLayout}}
import { AppSDViewLayout } from "@components/layout/sd-view-layout";
import { AppToolbar } from '@components/widgets/toolbar';
{{#each page.ctrls as | ctrl |}}
{{#eq ctrl.controlType 'FORM'}}
import {{ctrl.name}}Form from '@widgets/{{spinalCase ctrl.psAppDataEntity.codeName}}/{{spinalCase ctrl.codeName}}-form/{{spinalCase ctrl.codeName}}-form.vue';
{{/eq}}
{{/each}}
{{else}}
import { AppCtrlPos, AppScrollContainer, AppSimpleFlexContainer, AppStandardContainer, AppTabPanel, AppTabPage } from '@components/layout-element/structure';
{{#if page.psViewLayoutPanel.viewProxyMode}}
{{> @macro/widgets/ctrl/import-ctrl.hbs ctrls=page.psViewLayoutPanel.psControls}}
{{else}}
{{> @macro/widgets/ctrl/import-ctrl.hbs ctrls=page.ctrls}}
{{/if}}
{{/if}}
import { model } from "./{{spinalCase page.codeName}}-model";
import { 
    useNavParamsBind, 
    useEventBind, 
    handleCtrlAction, 
    handleCtrlInit, 
    handleCtrlDestroy, 
    getViewClassNames,
{{#unless page.psViewLayoutPanel.useDefaultLayout}}
    handleComponentAction,
{{/unless}}
} from "@/hooks/use-view";
import { WFDynaEditViewActionType, IContext, IParam, IWFDynaEditViewAbility, IWFDynaEditViewControllerParams, IWFDynaEditViewStore, WFDynaEditViewController, IWFDynaEditViewController, ILoadingHelper, IEvent } from '@/core';
{{#if page.psViewLayoutPanel.useDefaultLayout}}
// 组件注册
const componentList:any = {
{{#each page.ctrls as | ctrl |}}
{{#eq ctrl.controlType 'FORM'}}
{{ctrl.name}}Form,
{{/eq}}
{{/each}}
}
{{/if}}
{{> @macro/view/view-props.hbs}}

{{> @macro/common/emit.hbs name="view" actionType="WFDynaEditViewActionType" ability="IWFDynaEditViewAbility"}}

//  样式名称
const classNames = computed(() => {
    return getViewClassNames(model, props);
});

const params: IWFDynaEditViewControllerParams<WFDynaEditViewActionType, IWFDynaEditViewAbility> = {
    name: props.name,
    model,
    evt,
    openType: props.openType,
    pLoadingHelper: props.pLoadingHelper,
    isLoadDefault: props.isLoadDefault,
    handler: (data: IWFDynaEditViewStore) => { return reactive(data)}
};

{{> @macro/common/controller.hbs name="view" IController="IWFDynaEditViewController" store="IWFDynaEditViewStore" ability="IWFDynaEditViewAbility" controller="WFDynaEditViewController"}}

const handleActionClick = (event: MouseEvent, item: IParam) => {
    controller.handleActionClick(event, item);
}

const handleDynamicToolbarClick = (item: IParam) => {
    controller.handleDynamicToolbarClick(item);
}

const handleToolbarItemClick = (controller: IWFDynaEditViewController<IWFDynaEditViewStore, IWFDynaEditViewAbility>, name: string, event: MouseEvent, logic: any) => {
    controller.handleToolbarItemClick(event, logic);
}
</script>
